<style>
    .layui-table-page{
        text-align: right;
    }
</style>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
            <table class="layui-hide" id="table-data" lay-filter="table-data" style="overflow-x:scroll;"></table>
        </div>
    </div>
</div>
<script>
    var doSelectIdsUrl = "<?= $this->projectSet["url"]["doSelectIds"] ?>";
    var type_id = "<?= $type_id ?>";</script>
<script>
    layui.use(['laypage', 'layer', 'form', 'laydate', 'table'], function () {
    var laypage = layui.laypage,
            frm = layui.form,
            laydate = layui.laydate,
            layer = layui.layer,
            table = layui.table;
    //var tableObj = table.render({});
    var cookiePageArray = [];
    //存储已选择数据集，用普通变量存储也行，就是一个缓存变量
    layui.data('checkedVyingshou', null);
    table.render({
    elem: '#table-data'
            , url: '<?= $base_url ?>'
            //, toolbar: '#table-toolbar'
//            , defaultToolbar: ['filter', {
//                    title: '导出所有搜索结果' //标题
//                    , layEvent: 'export_all' //事件名，用于 toolbar 事件中使用
//                    , icon: 'layui-icon-export' //图标类名
//                }]
            //, defaultToolbar: ['filter']
            , title: '<?= $navName ?>'
            , size: 'sm'
            , cellMinWidth: 100
            , height: 350
            , totalRow:true
            , cols: [[
                    //{type: 'checkbox', fixed: 'left', LAY_CHECKED: false}
                    {field: 'fee_type_name', title: '费用类型', width: 80}
            , {field: 'unit_name', title: '计费方式', width: 80}
            , {field: 'unit_fee', title: '单价', width: 100, align:"right"}
            , {field: 'num', title: '数量', width: 100, align:"right", totalRowText: '合计:'}
            , {field: 'total_fee', title: '总价', width: 100, align:"right", totalRow:true}
<?php if ($type_id == 2) { ?>
                , {field: 'start_mileage', title: '开始公里数', width: 100}
                , {field: 'end_mileage', title: '结束公里数', width: 100}
<?php } ?>
            , {field: 'remark', title: '备注'}
            //, {field: 'created_at_alias', title: '添加日期', width: 150}

            ]
            ]
            , done: function (res, curr, count) {
            //.假设你的表格指定的 id="sale-data"，找到框架渲染的表格
            var tbl = $('#table-data').next('.layui-table-view');
            //记下当前页数据，Ajax 请求的数据集，对应你后端返回的数据字段
            cookiePageArray = res.data;
            //记录当前也选中的chechbox个数(判断全选使用的)
            var len = 0;
            //遍历当前页数据，对比已选中项中的 id
            for (var index = 0; index < cookiePageArray.length; index++) {
            //console.log(cookiePageArray);
            if (layui.data('checkedV', cookiePageArray[index]['id'])) {
            //逐个判断是否选中，如果已经选中就改变选中模式
            var i = cookiePageArray[index]['LAY_TABLE_INDEX'];
            //console.log(i);
            var checkbox = $('.layui-table tr[data-index=' + i + '] input[type="checkbox"]');
            checkbox.prop('checked', true);
            checkbox.next().addClass('layui-form-checked');
            //checkbox.parent().parent().parent().addClass('layui-table-click');
            //res.data[i].LAY_CHECKED = true;
            //为了设置全选的
            len++;
            }
            }

            //console.log(this.limit + "=====" + len);
            //设置全选checkbox的选中状态，只有改变LAY_CHECKED的值， table.checkStatus才能抓取到选中的状态
            if (len === this.limit) {
            var checkboxAll = $('.layui-table-header th[data-field=0] input[type="checkbox"]');
            checkboxAll.prop('checked', true);
            checkboxAll.next().addClass('layui-form-checked');
            //checkboxAll.parent().parent().parent().addClass('layui-table-click');
            }
            //暂时只能这样渲染表单
            frm.render('checkbox');
            }
    });
    //头工具栏事件
    table.on('toolbar(table-data)', function (obj) {
    var checkStatus = table.checkStatus(obj.config.id);
    var selectData = layui.data('checkedV', "select_data") ? layui.data('checkedV').select_data : [];
    switch (obj.event) {
    case 'batchYingshou':
            var length = selectData.length;
    if (length <= 0) {
    layer.msg('请选择订单');
    return false;
    }
    batchPay(1);
    break;
    case 'batchYingfu':
            var length = selectData.length;
    if (length <= 0) {
    layer.msg('请选择订单');
    return false;
    }
    batchPay(2);
    break;
    }
    });
    table.on('checkbox(table-data)', function (obj) {
    //console.log(obj.type); //如果触发的是全选，则为：all，如果触发的是单选，则为：one
    //全选或单选数据集不一样
    var data = 'one' === obj.type ? [obj.data] : cookiePageArray;
    var selectData = layui.data('checkedV', "select_data") ? layui.data('checkedV').select_data : [];
    //遍历数据
    $.each(data, function (index, item) {
    //假设你数据中 id 是唯一关键字
    if (obj.checked) {
    //alert(obj.tr);
    //console.log(obj.tr);
    //.增加已选中项
    layui.data('checkedV', {
    key: item.id, value: item
    });
    if (selectData.indexOf(item.id) > - 1) {//如果原来的键值存在,则不操作

    } else {
    selectData.push(item.id);
    }
    //obj.tr.addClass('layui-table-click');
    } else {
    //alert(0);
    //console.log(0);
    //.删除
    layui.data('checkedV', {
    key: item.id, remove: true
    });
    selectData.splice(selectData.indexOf(item.id), 1);
    //obj.tr.removeClass('layui-table-click');
    }
    layui.data('checkedV', {
    key: "select_data", value: selectData
    });
    });
    var ids = layui.data('checkedV', "select_data") ? layui.data('checkedV').select_data : [];
    $.ajax({
    type: "POST",
            dataType: "json",
            url: doSelectIdsUrl,
            data: {
            ids: ids
            },
            success: function (data) {
            }
    });
    //console.log(layui.data('checkedV'));
    });
    }
    );</script>
<script src="<?= PUBLIC_URL . "/" . $this->projectSet["file"]["js"] . "/view.js?" . rand() ?>"></script>

